<template>
    <div class="app-container calendar-list-container" v-loading="loading" element-loading-text="正在导出数据">
    <!-- filter 条件查询 -->
    <div class="btn-add">
        <el-button
        icon="el-icon-circle-plus-outline"
        type="button"
        class="el-button el-button--primary"
        @click="addInOrOut" >新增</el-button>
    </div>

    <!-- 新增数据弹窗 -->
    <el-dialog
      :title="title"
      :visible.sync="showAdd"
      @close="closeShow"
      width="65%"
    >
        <el-form :model="createForm" :inline="true" ref="createForm" :rules="addRules">
            <el-row :gutter="0">    
            <el-col :span="6">
                <el-form-item label="姓名" prop="userName"  label-width="80px" >
                  <el-input placeholder="请输入姓名" clearable v-model.trim="createForm.userName" class="ul-item"/>
              </el-form-item>
              <el-form-item label="岗位级别" prop="rankOfPosition" label-width="80px" >
                <el-select
                    v-model="createForm.rankOfPosition"
                    @change="changePosition"
                    placeholder="请选择岗位级别"
                    class="ul-item"
                    filterable
                    clearable>
                    <el-option
                        v-for="(item,index) in this.rankOfPositionList"
                        :key="index"
                        :label="item"
                        :value="item">
                    </el-option>
                </el-select>
              </el-form-item>
              
            </el-col>
            <el-col :span="6">
                <el-form-item label="工号" prop="jobNumber"  label-width="80px" >
                  <el-input placeholder="请输入工号" clearable v-model.trim="createForm.jobNumber" class="ul-item"/>
              </el-form-item>
              <el-form-item label="关键岗位" prop="keyPosition" label-width="80px" >    
                    {{ '否 ' }}<el-switch v-model="createForm.keyPosition" active-value="1" inactive-value="0" :disabled="title == '修改'"/>{{ ' 是' }}
              </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="部门" prop="workCenter" label-width="80px" >
                <el-select
                    v-model="createForm.workCenter"
                    @focus="getCenterList" 
                    @change="getCenterchange"
                    placeholder="请选择部门"
                    class="ul-item"
                    filterable
                    clearable>
                    <el-option
                        v-for="(item,index) in this.centerList"
                        :key="index"
                        :label="item"
                        :value="item">
                    </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="岗位名称" prop="jobTitle"  label-width="80px" >
                <el-select
                    v-model="createForm.jobTitle"
                    @focus="getJobTitle" 
                    @change="changeJobTitle" 
                    placeholder="请选择部门"
                    class="ul-item"
                    filterable
                    clearable>
                    <el-option
                        v-for="(item,index) in this.jobList"
                        :key="index"
                        :label="item.jobTitle"
                        :value="item.jobTitle">
                    </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="岗位类别" prop="jobCategory"  label-width="80px">
                <el-select
                    v-model="createForm.jobCategory"
                    placeholder="请选择岗位类别"
                    filterable
                    clearable   
                    class="ul-item">
                    <el-option
                        v-for="(item,index) in this.jobCategoryList"
                        :key="index"
                        :label="item"
                        :value="item">
                    </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="培训类别" prop="trainingCategory" label-width="80px" >
                <el-select
                    v-model="createForm.trainingCategory"
                    placeholder="请选择培训类别"
                    class="ul-item"
                    filterable
                    clearable>
                    <el-option
                        v-for="(item,index) in this.trainingCategoryLs"
                        :key="index"
                        :label="item"
                        :value="item">
                    </el-option>
                </el-select>
              </el-form-item>
            </el-col>
           </el-row>
           <el-row :gutter="0">
            <el-col :span="6">
                <el-form-item label="培训内容" prop="trainingContent"  label-width="80px">
                <el-select
                    v-model="createForm.trainingContent"
                    placeholder="请选择培训内容"
                    filterable
                    clearable       
                    @focus="getContent" 
                    @change="changeContent"
                    class="ul-item" style="width: 150px">
                    <el-option
                        v-for="(item,index) in this.contentList"
                        :key="index"
                        :label="item.trainingContent"
                        :value="item.trainingContent">
                    </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="来源类别" prop="souceType"  label-width="80px">
                <el-select
                    v-model="createForm.souceType"
                    placeholder="请选择来源类别"
                    filterable
                    clearable
                    class="ul-item" style="width: 150px">
                    <el-option
                        v-for="(item,index) in this.souceTypeList"
                        :key="index"
                        :label="item"
                        :value="item">
                    </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="培训导师" prop="trainingInstructor" label-width="80px" >
                    <!-- <el-input v-model="createForm.trainingInstructor" autosize style="width: 150px"/> -->
                    <el-select
                        v-model="createForm.trainingInstructor"
                        placeholder="请选择培训导师"
                        @focus="getTutor"
                        style="width: 150px"
                        filterable
                        clearable   
                        class="ul-item">
                        <el-option v-for="(item,index) in this.tutorList" :key="index" :label="item.userName" :value="item.userName">
                        </el-option>
                    </el-select>
                </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="培训结果" prop="trainingResults" label-width="80px" >
                    <el-select
                        v-model="createForm.trainingResults"
                        placeholder="请选择培训结果"
                        filterable
                        clearable   
                        class="ul-item">
                        <el-option v-for="(item,index) in this.trainingResultsLs" :key="index" :label="item" :value="item">
                        </el-option>
                    </el-select>
                </el-form-item>
            </el-col>
           </el-row>
           <el-row :gutter="0">
            <el-col :span="6">
                <el-form-item label="培训时间" prop="trainingTime" label-width="80px" >
                    <el-date-picker
                        v-model="createForm.trainingTime"
                        type="datetime"
                        placeholder="选择培训时间"
                        align="right"
                        format="yyyy-MM-dd HH:mm:ss"
                        value-format="yyyy-MM-dd HH:mm:ss"  
                        style="width: 180px"
                        >
                    </el-date-picker>
                </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="考核方式" prop="evaluationMode" label-width="80px" >
                    <el-select
                        v-model="createForm.evaluationMode"
                        placeholder="请选择考核方式"
                        filterable
                        clearable   
                        class="ul-item">
                        <el-option v-for="(item,index) in this.evaluationModeLs" :key="index" :label="item" :value="item">
                        </el-option>
                    </el-select>
                </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="考核人员" prop="assessorJobNumber" label-width="80px" >
                    <el-input v-model="createForm.assessorJobNumber" placeholder="请选择考核方式" autosize style="width: 150px"/>
                </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="考核时间" prop="assessmentTime" label-width="80px" >
                    <el-date-picker
                        v-model="createForm.assessmentTime"
                        type="datetime"
                        placeholder="选择考核时间"
                        align="right"
                        format="yyyy-MM-dd HH:mm:ss"
                        value-format="yyyy-MM-dd HH:mm:ss"  
                        style="width: 180px"
                        >
                    </el-date-picker>
                </el-form-item>
            </el-col>
           </el-row>
           <el-row :gutter="0">
            <el-col :span="12">
                <el-form-item label="培训签到" prop="trainingAttendanceSheet" label-width="80px" >
                    <el-upload
                      class="upload-demo"
                      action="http://192.168.3.11:8086/technologyFile"
                      :on-success="handlePdfSuccess"
                      :on-remove = "removePdf"  
                      :on-change= "pdfRemove"
                      :headers="getHttpHeader"
                      :before-upload="beforeFilsUpload"
                      :limit="1"
                      :file-list="fileList">
                      <el-button :disabled="bool1" size="small" type="primary">点击上传</el-button>
                    </el-upload>
                    <!-- <el-input v-model="createForm.trainingAttendanceSheet" type="textarea"/> -->
                </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="考核记录" prop="assessmentData" label-width="80px" >
                    <el-upload
                      class="upload-demo"
                      action="http://192.168.3.11:8086/technologyFile"
                      :on-success="handlePdfSuccess1"
                      :on-remove = "removePdf1"  
                      :on-change= "pdfRemove"
                      :headers="getHttpHeader"
                      :before-upload="beforeFilsUpload"
                      :limit="1"
                      :file-list="fileList1">
                      <el-button :disabled="bool2" size="small" type="primary">点击上传</el-button>
                    </el-upload>
                    <!-- <el-input v-model="createForm.assessmentData" type="textarea"/> -->
                </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="考核得分" prop="examinationScore"  label-width="80px" >
                  <el-input placeholder="请输入考核得分" clearable v-model.number="createForm.examinationScore" type="number" class="ul-item"/>
              </el-form-item>
            </el-col>
           </el-row>
        </el-form>

        <!-- 公共底部 -->
        <div slot="footer" class="dialog-footer">
            <el-button @click="showAdd = false">取 消</el-button>
            <el-button
            type="primary"
            @click="addfacility('createForm')"
            :loading="loadBool"
            >确认</el-button
            >
        </div>
    </el-dialog>


    <div class="filter-container">
      <!-- style="width: 150px;margin-right:15px;" -->
        <el-select 
            v-model="param.workCenter" 
            clearable
            filterable
            @focus="getCenterList" 
            style="margin-right: 15px;width: 140px"
            placeholder="请选择工作中心"
            class="ul-item">
            <el-option :value="item" :label="item" v-for="(item,index) in this.centerList" :key="index"/>
        </el-select>

        <el-select 
             v-model="param.jobCategory" 
             clearable      
             filterable
             style="margin-right: 15px;width: 140px"
             placeholder="请选择岗位类别"
             class="ul-item">
             <el-option :value="item" :label="item" v-for="(item,index) in this.jobCategoryList" :key="index"/>
        </el-select>

        <el-select 
             v-model="param.trainingCategory" 
             clearable      
             filterable
             style="margin-right: 15px;width: 140px"
             placeholder="请选择培训类别"
             class="ul-item">
             <el-option :value="item" :label="item" v-for="(item,index) in this.trainingCategoryLs" :key="index"/>
        </el-select>

        <el-input
            @keyup.enter.native="getData"
            clearable
            style="margin-right: 15px;width: 140px"
            v-model="param.jobTitle"
            placeholder="请输入岗位名称"        
        ></el-input>

        <el-input v-model="param.userName" placeholder="请输入姓名" autosize style="margin-right: 15px;width: 140px"/>

        <el-select 
             v-model="param.keyPosition"
             clearable      
             filterable
             style="margin-right: 15px;width: 140px"
             placeholder="是否关键岗位"
             class="ul-item">
             <el-option :value="item" :label="item" v-for="(item,index) in this.keyPositionList" :key="index"/>
        </el-select>


        <el-input v-model="param.trainingContent" placeholder="请选择培训内容" autosize style="margin-right: 15px;width: 140px"/>

        <el-input v-model="param.trainingInstructor" placeholder="请输入培训导师" autosize style="margin-right: 15px;width: 140px"/>
        <el-input v-model="param.assessorJobNumber" placeholder="请输入考核人员" autosize style="margin-right: 15px;width: 140px"/>

        <el-date-picker
        placeholder="开工时间"
          v-model="dateOptions"
          type="datetimerange"
          value-format="yyyy-MM-dd HH:mm:ss"
          format="yyyy-MM-dd HH:mm:ss"
          align="right"
          unlink-panels
          range-separator="至"
          start-placeholder="开始时间"
          end-placeholder="结束日期"
          :picker-options="pickerOptions"
          style="margin-right:15px;">
        </el-date-picker>

        <el-button type="primary" v-waves icon="el-icon-search" @click="getData">搜索</el-button>   
        <el-button
            type="button"
            v-waves
            class="el-button el-button--warning"
            @click="cancelSubmit"
        >
        重置</el-button>    
    </div>

    <!-- table 表格 -->
    <el-table  :data="tableInfo" v-loading="loadingList" element-loading-text="给我一首歌的时间" stripe border fit highlight-current-row style="width: 100%;margin-top:15px;">
      <el-table-column  label="序号" type="index" align="center" width="80px"/>
      <el-table-column label="姓名"  prop="userName" align="center"/>
      <el-table-column label="工号"  prop="jobNumber" align="center"/>
      <el-table-column label="部门"  prop="workCenter" align="center"/>
      <el-table-column label="岗位类别"  prop="jobCategory" align="center"/>
      <el-table-column label="岗位名称"  prop="jobTitle" align="center"/>   
      <el-table-column label="关键岗位"  prop="keyPosition" align="center">
        <template slot-scope="scope" >
            {{ scope.row.keyPosition == 1 ? '是':'否' }}
        </template>
      </el-table-column>
      <el-table-column label="岗位级别"  prop="rankOfPosition" align="center">
        <template slot-scope="scope" >
            {{ scope.row.rankOfPosition == 1 ? '试用级' 
            :scope.row.rankOfPosition == 2 ? '初级'
            :scope.row.rankOfPosition == 3 ? '中级'
            :scope.row.rankOfPosition == 4 ? '高级'
            :scope.row.rankOfPosition == 5 ? '师傅级':'-' }}
        </template>
      </el-table-column>
      <el-table-column label="培训类别"  prop="trainingCategory" align="center"/>
      <el-table-column label="来源类别"  prop="souceType" align="center"/>
      <el-table-column label="内容类别"  prop="contentType" align="center"/>
      <el-table-column label="培训内容"  prop="trainingContent" align="center" width="200"/>
      <el-table-column label="培训导师"  prop="trainingInstructor" align="center"/>
      <el-table-column label="培训时间"  prop="trainingTime" align="center"/>
      <el-table-column label="效果评价"  prop="effectivenessEvaluation" align="center"/>
      <el-table-column label="培训结果"  prop="trainingResults" align="center"/>
      <el-table-column label="考核方式"  prop="evaluationMode" align="center"/>
      <el-table-column label="考核人员"  prop="assessorJobNumber" align="center"/>
      <el-table-column label="考核时间"  prop="assessmentTime" align="center"/>
      <el-table-column label="考核得分"  prop="examinationScore" align="center"/>
      <el-table-column label="考核结果"  prop="evaluationResult" align="center"/>
      <el-table-column label="培训签到表"  prop="trainingAttendanceSheet" align="center" width="200px">
        <template slot-scope="scope" >  
          <el-link style="font-size: 12px" :href="scope.row.trainingAttendanceSheet" target="_blank">{{scope.row.trainingAttendanceSheet}}</el-link>
        </template>
      </el-table-column>
      <el-table-column label="考核记录"  prop="assessmentData" align="center" width="200px">
        <template slot-scope="scope" >  
          <el-link style="font-size: 12px" :href="scope.row.assessmentData" target="_blank">{{scope.row.assessmentData}}</el-link>
        </template>
      </el-table-column>
      <!-- <el-table-column  label="考核记录" align="center" width="100">
        <template slot-scope="scope">
            <el-image v-for="(item, index) in scope.row.assessmentData" :key='index' style="width: 30px; height: 30px" :src="item" :preview-src-list="scope.row.assessmentData" fit="scale-down">
                <div slot="error" class="image-slot">
                    <i class="el-icon-picture-outline"></i>
                </div>
            </el-image>
        </template>
      </el-table-column> -->
      <el-table-column label="操作" fixed="right"   align="center" width="250">
            <template slot-scope="scope" >
                <div class="fx" style="display: flex">
                    <el-button type="success" v-waves @click="resumeGeneration(scope.row)">履历生成</el-button> 
                    <el-button size="mini" type="primary" @click="handleEdit(scope.row)">修改</el-button>
                    <el-button
                        icon="el-icon-delete"
                        class="el-button el-button--danger"
                        style="font-size: 15px;"
                        @click="handleDelete(scope.row,scope.$index)"
                    ></el-button>
                </div>
            </template>
      </el-table-column>
    </el-table>

   <!-- pagination 分页 -->
    <div class="pagination-container">
      <el-pagination
        background
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="listQuery.page"
        :page-sizes="[5,10, 20, 30, 40, 100, 300, 500]"
        :page-size="listQuery.limit"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total"
      ></el-pagination>
    </div>
    <el-dialog title="员工岗位培训履历" center :visible.sync="showResume" width="70%">   
        <el-form :model="recordForm" :inline="true" ref="recordForm">
            <div style="display:flex;margin-bottom: 5px;">  
                <div>
                   <el-image style="width: 100px; height: 150px" :src="recordForm.imageUrl"></el-image>
                </div>
                <div>
                    <div style="display:flex;margin-bottom: 20px;margin-top: 20px;">
                        <el-form-item label="姓名" prop="userName" label-width="100px" >
                            <el-select disabled style="width: 100px;" filterable v-model="recordForm.userName" placeholder="" @change="changeName" @focus="getuserList" class="ul-item">
                                <el-option :value="item.userName" :label="item.userName" v-for="(item,index) in this.userList" :key="index"/>
                            </el-select>
                            <!-- <el-input v-model="recordForm.userName" placeholder="" autosize style="width: 150px"/> -->
                        </el-form-item>
                        <el-form-item label="工号" prop="jobNumber" label-width="100px" >
                        <el-select disabled style="width: 100px;" filterable v-model="recordForm.jobNumber" placeholder="工号" @change="changejobNumber" @focus="getuserList" class="ul-item">
                            <el-option :value="item.jobNumber" :label="item.jobNumber" v-for="(item,index) in this.userList" :key="index"/>
                        </el-select>
                        </el-form-item>
                        <el-form-item label="部门" prop="departmentName" label-width="100px" >
                            <el-input disabled v-model="recordForm.departmentName" placeholder="" autosize style="width: 120px"/>
                        </el-form-item>  
                        <el-form-item label="岗位类别" prop="jobCategory" label-width="100px" >
                            <el-input disabled v-model="recordForm.jobCategory" placeholder="" autosize style="width: 120px "/>
                        </el-form-item>
                        <el-form-item label="所在岗位" prop="jobTitle" label-width="80px" >
                            <el-input disabled v-model="recordForm.jobTitle" placeholder="" autosize style="width: 100px"/>
                        </el-form-item>
                    </div>
                    <div style="display:flex">
                        <el-form-item label="关键岗位" prop="criticalProcessName" label-width="100px" >
                            <el-input disabled v-model="recordForm.criticalProcessName" placeholder="" autosize style="width: 100px"/>
                        </el-form-item>
                        <el-form-item label="岗位级别" prop="jobClassStr" label-width="100px" >
                            <el-input disabled v-model="recordForm.jobClassStr" placeholder="" autosize style="width: 100px"/>
                        </el-form-item>
                        <el-form-item label="入职时间" prop="entryTime" label-width="100px" >
                            <el-input disabled v-model="recordForm.entryTime" placeholder="" autosize style="width: 130px"/>
                        </el-form-item>  
                        <el-form-item label="所会岗位" prop="userJobTitle" label-width="100px" >
                            <el-input disabled v-model="recordForm.userJobTitle" placeholder="" autosize style="width: 300px"/>
                        </el-form-item>
                    </div>
                </div>
            </div>
            {{'员工技能培训履历'}}
            <el-table  :data="tableData" v-loading="loadingList" element-loading-text="给我一首歌的时间" stripe border fit highlight-current-row style="width: 100%;margin-top:15px;">
              <el-table-column  label="序号" type="index" align="center" width="80px"/>
              <el-table-column label="培训内容"  prop="trainingContent" align="center" width="200"/>
              <el-table-column label="内容类别"  prop="contentType" align="center"/>
              <el-table-column label="培训类别"  prop="trainingCategory" align="center"/>
              <el-table-column label="导师/讲师"  prop="trainingInstructor" align="center"/>
              <el-table-column label="培训时间"  prop="trainingTime" align="center"/>
              <el-table-column label="培训评价"  prop="effectivenessEvaluation" align="center"/>
              <el-table-column label="培训结果"  prop="trainingResults" align="center"/>
              <el-table-column label="考核方式"  prop="evaluationMode" align="center"/>
              <el-table-column label="考试时间"  prop="assessmentTime" align="center"/>
              <el-table-column label="考核成绩"  prop="examinationScore" align="center"/>
              <el-table-column label="考核结果"  prop="evaluationResult" align="center"/>
            </el-table>
        </el-form>
        <div style="margin:  0;">
            <el-select
                v-model="util" 
                placeholder="类型"
                style="margin-right: 20px;width: 100px"
                >
                <el-option 
                :value="item" 
                :label="item" v-for="(item,index) in this.printerTypeList" 
                :key="index"/>
            </el-select>
            <el-select
                clearable
                v-model="printerName" 
                placeholder="请选择打印机"
                style="margin-right: 20px"
                >
                <el-option 
                :value="item" 
                :label="item" v-for="(item,index) in this.printerNameList" 
                :key="index"/>
            </el-select>
        </div>
        <div slot="footer" class="dialog-footer">
            <el-button
            type="primary"
            @click="configurationUpd"
            :loading="loadBool"
            >打印履历</el-button>
            <el-button
            type="primary"
            :loading="loadBool1"
            @click="downloadPDF"
            >下载PDF</el-button>
            <el-button @click="showResume = false">取 消</el-button>
        </div>
    </el-dialog>

    <el-button style="margin-right: 10px" type="success" size="small" @click="hExportExcel">导出数据Excel</el-button>

  </div>
</template>

<script>
import { recordFind,recordSave,recordUpd,recordDel,knowledgeFind,programFind,word03,word03Download,tutorFind } from "@/api/knowledgeSkill"
import { getCenter } from '../../api/workSection.js'
import { findZplPrinterInfoList } from '../../api/orderAndMachine'
import { searchWorkers} from '@/api/chargingData'
  import mixin from '../../utils/mixin.js'
  export default {
      name: 'skillsResume',
    mixins: [mixin],
    data () {
        return {
            listQuery: {
                page: 1,                                    //页码
                limit: 10                                   //每页多少条记录
            },
            param: {
                code: '',                      
                content: ''                    
            },
            title:'新增',
            total: 0,                                      //数据的总数
            tableInfo: [],
            tableMX:[],
            showMX: false,
            loadingList: false,
            loading: false,
            centerList: [],                         //工作中心列表
            createForm: {},
            updForm: {},
            props: { multiple: true },
            loadBool:false,
            loadBool1:false,
            // 表单校验
            addRules: {
                userName: [
                    { required: true, message: "姓名不能为空!", trigger: "change" },
                ],
                jobTitle: [
                    { required: true, message: "岗位名称不能为空!", trigger: "change" },
                ],
                jobNumber: [
                    { required: true, message: "工号不能为空!", trigger: "change" },
                ],
                keyPosition: [
                    { required: true, message: "关键岗位不能为空!", trigger: "change" },
                ],
                workCenter: [
                    { required: true, message: "部门不能为空!", trigger: "change" },
                ],
                rankOfPosition: [
                    { required: true, message: "岗位级别不能为空!", trigger: "change" },
                ],
                jobCategory: [
                    { required: true, message: "岗位类别不能为空!", trigger: "change" },
                ],
                trainingCategory: [
                    { required: true, message: "培训类别不能为空!", trigger: "change" },
                ],
                trainingContent: [
                    { required: true, message: "培训内容不能为空!", trigger: "change" },
                ],
                trainingInstructor: [
                    { required: true, message: "培训导师不能为空!", trigger: "change" },
                ],
                trainingResults: [
                    { required: true, message: "培训结果不能为空!", trigger: "change" },
                ],
                trainingTime: [
                    { required: true, message: "培训时间不能为空!", trigger: "change" },
                ],
                evaluationMode: [
                    { required: true, message: "考核方式不能为空!", trigger: "change" },
                ],
                assessorJobNumber: [
                    { required: true, message: "考核人员不能为空!", trigger: "change" },
                ],
                souceType: [
                    { required: true, message: "来源类别不能为空!", trigger: "change" },
                ],
                assessmentTime: [
                    { required: true, message: "考核时间不能为空!", trigger: "change" },
                ],
                examinationScore: [
                    { required: true, message: "考核得分不能为空!", trigger: "change" },
                ],
                // trainingAttendanceSheet: [
                //     { required: true, message: "培训签到不能为空!", trigger: "change" },
                // ],
                // assessmentData: [
                //     { required: true, message: "考核记录不能为空!", trigger: "change" },
                // ],
            },
            showAdd: false,
            showResume: false,
            showupd: false,
            userInfo: this.$store.state.user.userInfo,
            dateOptions: this.getNowTime(),
            pickerOptions: {
                shortcuts: [{
                    text: '最近一周',
                    onClick(picker) {
                    const end = new Date();
                    const start = new Date();
                    start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
                    picker.$emit('pick', [start, end]);
                    }
                }, {
                    text: '最近一个月',
                    onClick(picker) {
                    const end = new Date();
                    const start = new Date();
                    start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
                    picker.$emit('pick', [start, end]);
                    }
                }, {
                    text: '最近三个月',
                    onClick(picker) {
                    const end = new Date();
                    const start = new Date();
                    start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
                    picker.$emit('pick', [start, end]);
                    }
                }]
            },
            jobCategoryList: ['1线','1.5线','2线'],
            rankOfPositionList: ['试用级','初级','中级','高级','师傅级'],
            jobCategoryList: ['1线','1.5线','2线'],
            keyPositionList: ['是','否'],
            trainingCategoryLs: ['入职培训','岗前培训','岗位培训','专业培训','岗位案例培训','关键工序培训','岗位实操培训'],
            trainingResultsLs: ['不合格','合格','良好','优秀'],
            evaluationModeLs: ['理论考核','实操考核'],
            jobList:[],           // 岗位列表
            getHttpHeader: {                    //上传文件的头
                Authorization: '',              //传输文件的token
                CHECK_USER_VALUE: 'GOLWAY',
                CHECK_PASSWORD_VALUE: '8D4DD3F80CEB6149329FDBD590B164F1'
            },
            fileList:[],  
            fileList1:[],  
            bool1: false,
            bool2: false,
            contentList:[],
            recordForm:{},
            userList: [],
            tableData:[],
            util: '双面',
            printerTypeList: ['单面','双面'],
            printerName: '',
            printerNameList: [],
            souceTypeList:['入职培训','定期培训','外部培训','晋级培训','降级培训','转岗培训','关键工序'],
            tutorList:[]  // 培训导师列表
        }
    },
    computed: {
      inputWid() {
        return function (value) {
            if(!value || (value.length <= 10)){
              return '150px'
            } else {    
              return (150 + (String(value).length-10)*6) + 'px'
            }
        }
      }
    },
    methods: {
        // 切割图片url组成的字符串成为数组
        cuttingStr(value) {
          console.log(value)
            let imageArr = []                           //存储图片url的数组
            if(value != '' && value != null) {                           //第一层嵌套判断是否有图片，为空直接返回一个空数组
                if(value.includes('|')){
                  imageArr = value.split('|')             //第二层嵌套将图片拆分为数组
                } else{
                  imageArr.push(value)
                }
                return imageArr
            } else {
                return imageArr
            }
        },
        // 点击下载pdf
        async downloadPDF(){
            let query = {
                jobNumber: this.recordForm.jobNumber
            }
            this.loadBool1 = true
            const res = await word03Download(query)
            const errMsg = res.data.message
            this.loadBool1 = false
            console.log(res)
            if(res.data.code == '500') return
            if(res.data.code != '1') return this.$message.error(errMsg)
            this.$message.success(errMsg)
            // window.location.assign(res.data.results)   
            // window.location.replace(res.data.results)
            window.location.href = res.data.results
        },
        async changejobNumber(e){
        if(!e) return this.recordForm.userName = ''
        this.userList.forEach(item => {
            if(item.jobNumber == e){
                this.getInfo(item)
                this.getrecordFind()
            }
        })
      },
        async changeName(e){
        if(!e) return this.recordForm.jobNumber = ''
        this.userList.forEach(item => {
            if(item.userName == e){
                this.getInfo(item)
                this.getrecordFind()
            }
        })
      },
        // 获取个人信息
        async getuserList(e){  
            let query = {page:1,limit:9999,status:1}
            const {data} = await searchWorkers(query)
            this.userList = data.records
        },
        // 获取导师列表
        async getTutor(){
            let query = {page:1,limit:10000}
            const {data} = await tutorFind(query)
            // 姓名去重 
            const seenIds = new Set();
            const uniqueArray = data.list.filter(item => {
                if (!seenIds.has(item.userName)) {
                    seenIds.add(item.userName);
                    return true;
                }
                return false;
            });
            this.tutorList = uniqueArray
        },
        // 点击生成履历
        async resumeGeneration(row){
            if(!this.tableInfo.length) return this.$message.error("员工履历没列表!")
            this.showResume = true
            let query = {
                page:1,
                limit:9999,
                // status:1,
                username: row.userName,
                jobNumber: row.jobNumber,
            }
            const res = await searchWorkers(query)
            const getItem = res.data.records[0]
            if(!res.data.records.length) return
            this.getInfo(getItem)
            this.getrecordFind()
        },
        async getrecordFind(){
            let query = {
                page:1,
                limit:9999,
                userName: this.recordForm.userName,
                jobNumber: this.recordForm.jobNumber,
            }
            const res = await recordFind(query)
            this.tableData = res.data.list
            console.log(res)
        },
        getInfo(getItem){
            this.$set(this.recordForm,'userName',getItem.userName)
            this.$set(this.recordForm,'jobNumber',getItem.jobNumber)
            this.$set(this.recordForm,'departmentName',getItem.departmentName)
            this.$set(this.recordForm,'entryTime',getItem.entryTime)
            this.$set(this.recordForm,'imageUrl',getItem.imageUrl)
            if(getItem.userKnowledgePost){
                this.$set(this.recordForm,'jobCategory',getItem.userKnowledgePost.jobCategory)
                this.$set(this.recordForm,'jobTitle',getItem.userKnowledgePost.jobTitle)
                this.$set(this.recordForm,'criticalProcessName',getItem.userKnowledgePost.criticalProcessName)
                // this.$set(this.recordForm,'jobClassStr',getItem.userKnowledgePost.rankOfPosition)
                if(getItem.userKnowledgePost.rankOfPosition == 1){    
                    this.$set(this.recordForm,'jobClassStr','试用级')
                }else if(getItem.userKnowledgePost.rankOfPosition == 2){    
                    this.$set(this.recordForm,'jobClassStr','初级')
                }else if(getItem.userKnowledgePost.rankOfPosition == 3){    
                    this.$set(this.recordForm,'jobClassStr','中级')
                }else if(getItem.userKnowledgePost.rankOfPosition == 4){    
                    this.$set(this.recordForm,'jobClassStr','高级')
                }else if(getItem.userKnowledgePost.rankOfPosition == 5){    
                    this.$set(this.recordForm,'jobClassStr','师傅级')
                }else{    
                    this.$set(this.recordForm,'jobClassStr',getItem.userKnowledgePost.rankOfPosition)
                }
            }
            if(getItem.jobTitleList.length) { 
              let names = getItem.jobTitleList.map(user => user.jobTitle);  
              this.recordForm.userJobTitle = names.join(',');  
            }
        },
        // 获取培训内容
        async getContent(){
            const res  = await programFind({page:1,limit:10000})
            console.log(res)
            this.contentList = res.data.list  
        },
        // 修改培训内容
        changeContent(e){
            this.contentList.forEach(item =>{
                if(item.trainingContent == e){
                    this.createForm.trainingInstructor = item.userName
                }
            })
        },
        // 获取岗位名称
       async getJobTitle(){
            if(!this.createForm.workCenter) return this.$message.warning('请先选择部门！')
            if(!this.createForm.rankOfPosition) return this.$message.warning('请先选择岗位级别！')
            let query = {
                page:1,
                limit:10000,
                workCenter:this.createForm.workCenter
            }
            this.createForm.rankOfPosition == '试用级' ? query.rankOfPosition = 1
            :this.createForm.rankOfPosition == '初级' ? query.rankOfPosition = 2
            :this.createForm.rankOfPosition == '中级' ? query.rankOfPosition = 3
            :this.createForm.rankOfPosition == '高级' ? query.rankOfPosition = 4
            :this.createForm.rankOfPosition == '师傅级' ? query.rankOfPosition = 5:''
            const res = await knowledgeFind(query)
            this.jobList = res.data.list
        },
        // 岗位名称改变
        async changeJobTitle(e){
        this.jobList.forEach(item =>{
            if(item.jobTitle == e){
                this.createForm.userKnowledgePostId = item.id
            }
        })
        },
        // 岗位级别改变
        async changePosition(){
            this.$set(this.createForm,'userKnowledgePostId','')
            this.$set(this.createForm,'jobTitle','')
            // this.createForm.userKnowledgePostId = ''
            // this.createForm.jobTitle = ''
        },
        // 部门改变
        getCenterchange(){
            this.$set(this.createForm,'userKnowledgePostId','')
            this.$set(this.createForm,'jobTitle','')
        },
        // 文件上传之前的函数，将token传入头中
        beforeFilsUpload(file) {
            // 检查文件类型是否为 PDF
            const isPDF = file.type === 'application/pdf';
            if (!isPDF) {
               this.$message.error('只能上传 PDF 格式的文件！');
            }
            this.getHttpHeader.Authorization = this.dealCookie()
            return isPDF
        },
        // cookies的处理函数
        dealCookie() {
            const strcookie = document.cookie                     //获取cookie字符串
            const arrcookie = strcookie.split("; ")               //分割
            for ( var i = 0; i < arrcookie.length; i++) {
                const arr = arrcookie[i].split("=")
                if (arr[0] == "agent_Authorization") {
                    return arr[1]
                }
            }
            return ""
        },
        pdfRemove(e){
            if(e.status == 'fail') return this.$message.error("文件上传失败!")
            else if(e.status == 'success') return this.$message.success("文件上传成功!")
        },
        // 移除pdf
        async removePdf(file) {
          this.bool1 = false
          return this.createForm.trainingAttendanceSheet = ''
        },
        async removePdf1(file) {
          this.bool2 = false
          return this.createForm.assessmentData = ''
        },
        // 上传PDF文档成功回调函数
        handlePdfSuccess(response) {
          this.bool1 = true
          this.createForm.trainingAttendanceSheet = response.results
          console.log(1,this.createForm.trainingAttendanceSheet)
        },
        // 上传PDF文档成功回调函数
        handlePdfSuccess1(response) {
          this.bool2 = true
          this.createForm.assessmentData = response.results
          console.log(1,this.createForm.assessmentData)
        },
        getNowTime() {
                let dateTime = +new Date()+8*3600*1000
                const start = new Date(dateTime - 3600 * 1000 * 24 * 7)
                    .toISOString()
                    .replace('T', ' ')
                    .split('.')[0] //默认开始时间7天前
                const end = new Date(dateTime)
                    .toISOString()
                    .replace('T', ' ')
                    .split('.')[0]//默认结束时间当前时间
                console.log([start, end])
                return [start, end]
            },
        getData(){
          this.listQuery.page = 1
          this.listQuery.limit = 10
          this.handleFilter()
        },
        // 点击打印
        async configurationUpd(){
            if(!this.printerName) return this.$message.error('请选择打印机！')
            if(!this.recordForm.jobNumber) return this.$message.error('请选择员工！')
            let query = {
                util: this.util == '双面'?'双':'单',
                printerName: this.printerName,
                jobNumber: this.recordForm.jobNumber
            }
            this.loadBool = true
            const data = await word03(query)
            const errMsg = data.msg
            this.loadBool = false
            if(data.code == '500') return
            if(data.code != '1') return this.$message.error(errMsg)
            this.showupd = false
            this.$message.success(errMsg)
        },
        async handleFilter() {
            this.loadingList = true
            let query = Object.assign({},this.listQuery)
            if(this.dateOptions){ query.startTime = this.dateOptions[0],query.endTime = this.dateOptions[1]}
            if(this.param.workCenter){ query.workCenter = this.param.workCenter}
            if(this.param.jobCategory){ query.jobCategory = this.param.jobCategory}
            if(this.param.jobTitle){ query.jobTitle = this.param.jobTitle}
            if(this.param.userName){ query.userName = this.param.userName}
            if(this.param.keyPosition){ query.keyPosition = this.param.keyPosition}
            if(this.param.trainingContent){ query.trainingContent = this.param.trainingContent}
            if(this.param.trainingInstructor){ query.trainingInstructor = this.param.trainingInstructor}
            if(this.param.assessorJobNumber){ query.assessorJobNumber = this.param.assessorJobNumber}
            if(this.param.trainingCategory){ query.trainingCategory = this.param.trainingCategory}
            if(this.param.keyPosition == '是'){query.keyPosition = 1} else if(this.param.keyPosition == '否'){query.keyPosition = 0}
            let data = await recordFind(query)
            let errmsg = data.msg
            this.loadingList = false
            if(data.code == '500') return
            if(data.code != '1') return this.$message.error(errmsg)
            this.total = data.data.count
            this.tableInfo = data.data.list
            // this.tableInfo.forEach(item => {
            //       item.trainingAttendanceSheet = this.cuttingStr(item.trainingAttendanceSheet)
            //       item.assessmentData = this.cuttingStr(item.assessmentData)
            //     });
        },
        // table表单下方的页码组件改变每页显示的数据条数
        handleSizeChange(val) {
          this.listQuery.limit = val
          this.handleFilter()
        },
        // table表单下方的页码组件改变页面
        handleCurrentChange(val) {
          this.listQuery.page = val
          this.handleFilter()
        },
        transformDat(res) {
          const mapInfo = {
            index: '序号',
            userName: '姓名',
            jobNumber: '工号',
            workCenter: '部门',
            jobCategory: '岗位类别',
            jobTitle: '岗位名称',
            keyPosition: '关键岗位',
            rankOfPosition: '岗位级别',
            trainingCategory: '培训类别',
            contentType: '内容类别',
            trainingContent: '培训内容',
            trainingInstructor: '培训导师',
            trainingTime: '培训时间',
            effectivenessEvaluation: '效果评价',
            trainingResults: '培训结果',
            evaluationMode: '考核方式',
            assessorJobNumber: '考核人员',
            assessmentTime: '考核时间',
            examinationScore: '考核得分',
            evaluationResult: '考核结果',
            trainingAttendanceSheet: '培训签到表',
            assessmentData: '考核记录',
          }
          // 对data进行格式化
          // 取出所有的属性名
          const props = Object.keys(res[0]) // ['id','']
          // 将属性名从英文转为中文
          const header = props.map(zhkey => mapInfo[zhkey])
          console.log('中文的表头', header)
          // const data=[['xxxx','总裁办'，'13800000']]
          const data = res.map(obj => Object.values(obj))
          return { header, data }
        },
        handleDelete(row,index) {
            // this.$confirm('这将会永久删除该行数据，是否继续?', '警告', {
            //     confirmButtonText: '确定',
            //     cancelButtonText: '取消',
            //     type: 'warning'
            // }).then(() => {
                this.delprocess(row,index)
            // }).catch(() => {
            //     this.$message({
            //       type: 'info',
            //       message: '已取消删除'
            //     })
            // })
        },
        async delprocess(row,index){
          let res = await recordDel({id: row.id})
          if(res.code == '500') return
          if(res.code != '1') return this.$message.error(res.msg)
          this.tableInfo.splice(index,1)
          this.$message.success(res.msg)
        },
        // 导出excel
        async hExportExcel() {
          this.loading = true
          let query = Object.assign({},this.listQuery)
          query.page = 1
          query.limit = 10000
          if(this.dateOptions){ query.startTime = this.dateOptions[0],query.endTime = this.dateOptions[1]}
          if(this.param.workCenter){ query.workCenter = this.param.workCenter}
          if(this.param.jobCategory){ query.jobCategory = this.param.jobCategory}
          if(this.param.jobTitle){ query.jobTitle = this.param.jobTitle}
          if(this.param.userName){ query.userName = this.param.userName}
          if(this.param.keyPosition){ query.keyPosition = this.param.keyPosition}
          if(this.param.trainingContent){ query.trainingContent = this.param.trainingContent}
          if(this.param.trainingInstructor){ query.trainingInstructor = this.param.trainingInstructor}
          if(this.param.assessorJobNumber){ query.assessorJobNumber = this.param.assessorJobNumber}
          if(this.param.trainingCategory){ query.trainingCategory = this.param.trainingCategory}
          if(this.param.keyPosition == '是'){query.keyPosition = 1} else if(this.param.keyPosition == '否'){query.keyPosition = 0}
          let arr = await recordFind(query)
          if(arr.code == '500') return
          if(arr.code != '1'){
            this.loading = false
            return this.$message.error(errmsg)
          }
          if(!arr.data.list.length){
            this.loading = false
            this.$message.error('暂无数据')
          }
          const { header, data } = this.transformDat(this.setSort(arr.data.list))
          import('@/vendor/Export2Excel').then(excel => {
            // excel表示导入的模块对象
            console.log(excel)
            excel.export_json_to_excel({
            header, // 表头 必填
            data, // 具体数据 必填
            filename: '员工技能履历', // 文件名称
            autoWidth: true, // 宽度是否自适应
            bookType: 'xlsx' // 生成的文件类型
            })
          })
          this.loading = false
        },
        // 排序函数
        setSort(arr){
          let newArr = JSON.parse(JSON.stringify(arr))
          let arr1 = []
          newArr.forEach((item,index)=>{
            let obj = {
              index: index+1,
              userName:item.userName,
              jobNumber:item.jobNumber,
              workCenter:item.workCenter,
              jobCategory:item.jobCategory,
              jobTitle: item.jobTitle,
              keyPosition: item.keyPosition == 1 ? '是':'否',
              rankOfPosition:item.rankOfPosition,
              trainingCategory:item.trainingCategory,
              contentType:item.contentType,
              trainingContent:item.trainingContent,
              trainingInstructor:item.trainingInstructor,
              trainingTime:item.trainingTime,
              effectivenessEvaluation:item.effectivenessEvaluation,
              trainingResults:item.trainingResults,
              evaluationMode:item.evaluationMode,
              assessorJobNumber:item.assessorJobNumber,
              assessmentTime:item.assessmentTime,
              examinationScore:item.examinationScore,
              evaluationResult:item.evaluationResult,
              trainingAttendanceSheet:item.trainingAttendanceSheet,
              assessmentData:item.assessmentData,
            }
            arr1.push(obj)
          })
          return arr1
        },
        cancelSubmit(){
            this.param = {
                code: '',           
                content: '',      
            }
            this.listQuery.page = 1
            this.handleFilter()
        },
        // 提交表单之前先进行验证
        addfacility(formName) {
            this.$refs[formName].validate((valid) => {
                if (valid) {
                    this.submitprocess()
                } else {
                    return false
                }
            })
        },
        async submitprocess(){
            let query = Object.assign({},this.createForm)
            if(this.createForm.rankOfPosition){
                this.createForm.rankOfPosition == '试用级' ? query.rankOfPosition = 1
                :this.createForm.rankOfPosition == '初级' ? query.rankOfPosition = 2
                :this.createForm.rankOfPosition == '中级' ? query.rankOfPosition = 3
                :this.createForm.rankOfPosition == '高级' ? query.rankOfPosition = 4
                :this.createForm.rankOfPosition == '师傅级' ? query.rankOfPosition = 5:''
            }
            if(query.trainingResults == '优秀'){
                query.effectivenessEvaluation = 'A'
            }else if(query.trainingResults == '良好'){
                query.effectivenessEvaluation = 'B'
            }else if(query.trainingResults == '合格'){
                query.effectivenessEvaluation = 'C'
            }else if(query.trainingResults == '不合格'){
                query.effectivenessEvaluation = 'D'
            }
            if(query.examinationScore >= 85){
                query.evaluationResult = '优秀'
            }else if(query.examinationScore >= 75){
                query.evaluationResult = '良好'
            }else if(query.examinationScore >= 65){
                query.evaluationResult = '合格'
            }else if(query.examinationScore < 65){
                query.evaluationResult = '不合格'
            }
            delete query.jobTitle
            console.log(this.createForm)
            console.log(query)
            let data
            this.loadBool = true
            if(this.title == '新增'){
                data = await recordSave(query)
            } else {
                data = await recordUpd(query)
            }
            const errMsg = data.msg
            this.loadBool = false
            if(data.code == '500') return
            if(data.code != '1') return this.$message.error(errMsg)
            this.$message.success(errMsg)
            this.resetForm()
            this.showAdd = false
            this.handleFilter()
        },
        resetForm(){
            this.createForm = {}
            this.fileList = []
            this.fileList1 = []
            this.bool1 = false
            this.bool2 = false
            this.$refs.createForm.resetFields()
        },
        closeShow(){
            if(this.title == '修改'){       
                this.createForm = {}
                this.fileList = []
                this.fileList1 = []
                this.bool1 = false
                this.bool2 = false
                this.$refs.createForm.resetFields()
            }
            this.showAdd = false
        },
        handleEdit(row){
            this.title = '修改'
            this.createForm = Object.assign({},row) 
            this.createForm.rankOfPosition == 1 ? this.createForm.rankOfPosition = '试用级' 
                :this.createForm.rankOfPosition == 2 ? this.createForm.rankOfPosition = '初级'
                :this.createForm.rankOfPosition == 3 ? this.createForm.rankOfPosition = '中级'
                :this.createForm.rankOfPosition == 4 ? this.createForm.rankOfPosition = '高级'
                :this.createForm.rankOfPosition == 5 ? this.createForm.rankOfPosition = '师傅级':''
            if(row.trainingAttendanceSheet){
                this.fileList = [{name: 'food.jpeg', url: row.trainingAttendanceSheet}]
                this.bool1 = true
            }
            if(row.assessmentData){
                this.fileList1 = [{name: 'food.jpeg', url: row.assessmentData}]
                this.bool2   = true
            }
            this.showAdd = true
        },
        addInOrOut(){
            this.title = '新增'
            this.showAdd = true
        },
        async getPrinter(){
            const data = await findZplPrinterInfoList()
            if(data.code == '1'){
                console.log('data',data);
                this.printerNameList = JSON.parse(JSON.stringify(data.data))
                this.printerNameList.forEach((item,index) =>{
                    if(item.indexOf('\\\\')>=0){
                       this.printerNameList[index] = item.split('\\')[3]
                    }
                })
                console.log(this.printerNameList)
            }
        },
    },
    // 进入页面获取table信息
    mounted() {
        this.handleFilter()
        this.getPrinter()
    }
}
</script>

<style>

.btn-add{
    margin-bottom: 28px;
}

.ul-item{
  width: 85%;
}
</style>
